<template>
     <div id="sample">
        <!--accept定义接收的文件类型,这里只接受图片-->
        <input id="fileinput" @change="uploading($event)" type="file" name="file" accept="image/jpeg" multiple>
        <button  @click="submit($event)">发送</button>
        <h1>{{file}}</h1>
        <i>{{src}}</i>
     </div>
</template>
<script>
export default {
  data () {
    return {
        file:'',
        src:''
    };
  },
  methods:{ 
   uploading(event){
       this.file = event.target.files[0];
       var windowURL = window.URL || window.webkitURL;
        this.file = event.target.files[0];
       // console.log(222);        
        //创建图片文件的url
        this.src = windowURL.createObjectURL(event.target.files[0]);
   },
   submit(){
   event.preventDefault();//取消默认行为
   let formdata = new FormData();
    formdata.append('title','new标题');
    formdata.append('desc','内容');
    formdata.append('files',this.file);
   
    this.$store.state.isfile = true;
    console.log( this.$store.state.isfile);///////////
    console.log(formdata.get('file'));
//此处必须设置为  multipart/form-data
    let config = {
            headers: {
                'Content-Type': 'multipart/form-data'  //之前说的以表单传数据的格式来传递fromdata
            }
        };
       
    this.$http.post("http://125.210.160.93:8080/SmEdu/pass/news/add",
    formdata, config).then( (res) => {
    console.log(res);
    }).catch((error) =>{
        console.log(error);
    });
   }
  }
};

</script>
